<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<HEAD>
     <TITLE>Border-Spacing - Cascading Style Sheets Properties</TITLE>
     <link rel="stylesheet" type="text/css" href="../../../ss/2.css" id="thecss">
     <script type="text/javascript" src="../../../scripts/csschange.js"></script>
</HEAD>

<BODY onload="readSS()">

<br>
<center>
<table border=3 cellpadding=5 cellspacing=0>
<tr>
    <td rowspan=2><h1 class="pagetitle">border-spacing</h1>
    <b><a href="../../../misc/suppkey.htm">Support Key:</a></b>
    [<b><i class="fs">CSS2</i></b>|<b class="s">CSS2.1</b>] 
    [<b class="s">N6</b>|<b><i class="fs">O4</i></b>|<b class="s">S1.2</b>]<br></td>
    <td align=center><b class="alert">Other Table Properties</b><br></td>
</tr>
<tr>
    <td align=center><a href="bcollapse.htm">border-collapse</a><br>
    <a href="capside.htm">caption-side</a><br>
    <a href="emptycell.htm">empty-cells</a><br>
    <a href="speakhead.htm">speak-header</a><br>
    <a href="tlayout.htm">table-layout</a><br></td>
</tr>
<tr><td align=center colspan=2>
<font size=2>= <span class="sitetitle">Index DOT Css</span> by <a 
href="../../../misc/email.htm">Brian Wilson</a> =</font><br>
</td></tr>
</table>
</center>

<div align="center">
<table cellpadding=5 cellspacing=0>
<tr>
    <td>&#160;&#160;<font size=2><a href="../../index.html">Main Index</a> |
        <a href="../../propindex/font.htm">Property Index</a> |
        <a href="../../supportkey/syntax.htm">CSS Support History</a> |
        <a href="../../../history/browsers.htm">Browser History</a></font>&#160;&#160;</td>
</tr>
</table>
</div>
<hr size=1 align="center" width="25%">

<br><br>
<table border=1 cellspacing=0 cellpadding=5>
<tr><td>
<table border=0 cellspacing=0>
<tr>
    <th colspan=3 valign=bottom class="field"><big><u><b
        class="colheaders">&#160;&#160;&#160;Quick Statistics&#160;&#160;&#160;</b></u></big><br></th>
</tr>
<tr><th align=left><b class="l3heading">Default Value: </b><br></th>
    <td rowspan=6>&nbsp;&nbsp;</td>
    <td><b class="alert">0</b></td></tr>
<tr><th align=left><b class="l3heading">Applicable Elements: </b><br></th>
    <td>&lt;<b class="tagname">table</b>&gt; or elements with an assigned
        '<span class="property">display</span>' value of "table" or "inline-table"</td></tr>
<tr><th align=left><b class="l3heading">Inherit From Parent: </b><br></th>
    <td>Yes</td></tr>
<tr><th align=left><b class="l3heading">Applicable Media: </b><br></th>
    <td>Visual</td></tr>
<tr><th align=left><b class="l3heading">HTML Equivalent: </b><br></th>
    <td>NA</td></tr>
<tr><th align=left><b class="l3heading">Official Docs: </b><br></th>
    <td><a href="http://www.w3.org/TR/REC-CSS2/tables.html#separated-borders">CSS2: Sect. 17.6.1</a>, 
        <a href="http://www.w3.org/TR/CSS21/tables.html#separated-borders">CSS2.1: Sect 17.6.1</a></td></tr>
</table>
</td></tr>
</table>

<dl>
<dt><big><b class="mainheading">What is it?</b></big>
    <dd>This property specifies the distance between the borders of adjacent
        table cells in the "separated borders" model. The space between table
        cells uses the background color/image specified for the explicit or
        assigned TABLE element.
</dl>

<dl>
<dt><br><big><b class="mainheading">Allowed Values</b></big>
<dt><b class="subheading">inherit</b></dt>
<dt>[<b><i class="fs">CSS2</i></b>|<b class="s">CSS2.1</b>] 
    [<b><i class="fs">N6</i></b>|<b class="s">S1.2</b>]</dt>
    <dd><b class="l3heading">Type:</b> Explicit</dd>
    <dd><b class="l3heading">Description:</b><br>
        Explicitly sets the value of this property to that of the parent.</dd>

<dt><b class="subheading">[length length]</b></dt>
<dt>[<b><i class="fs">CSS2</i></b>|<b class="s">CSS2.1</b>] 
    [<b class="s">N6</b>|<b><i class="fs">O4</i></b>|<b class="s">S1.2</b>]</dt>
    <dd><b class="l3heading">Type:</b> Explicit</dd>
    <dd><b class="l3heading">Syntax:</b> [length] ([length])?</dd>
    <dd><b class="l3heading">Description:</b><br>
        Specifies an explicit border spacing. Listing one length value should
        assign the value to both horizontal and vertical spacing, while
        specifying two values should assign the first value to the horizontal
        spacing and the second value to the vertical spacing.</dd>
</dl>

<dl>
<dt><big><b class="mainheading">Example</b></big>
    <dd><div class="example">Ext/Doc: <b class="selector">table</b> {
        <span class="property">border:</span> medium double red;<br>
        <span class="property">border-collapse:</span> separate;
        <span class="property">border-spacing:</span> 10pt 5pt }</div>
    <dd><div class="example">In-Line:&#160; &lt;<b class="tagname">table</b>
        <span class="tagattrib">STYLE</span>=&quot;<span
        class="property">border:</span> medium double red;<br>
        <span class="property">border-collapse:</span> separate;
        <span class="property">border-spacing:</span> 10pt 5pt&quot;&gt;</div>
</dl>

<big><b class="mainheading">Browser Peculiarities</b></big>
<ul>
    <li>Opera 7.x: If a value of "inherit" is used for this property on a nested table, 
        the display of the nested table becomes completely unusable.
</ul>

<br><br>
<a href="../../../misc/copyright.htm">Boring Copyright Stuff....</a>
<br>

</BODY>
</HTML>